layui.use(['table', 'admin', 'ax', 'func','laydate','formSelects', 'form'], function () {
    var $ = layui.$;
    var table = layui.table;
    var $ax = layui.ax;
    var admin = layui.admin;
    var func = layui.func;
    var form = layui.form

    function getData(type, date){
        var ajax = new $ax(Feng.ctxPath + "/nanData/chartData");
        ajax.set("type", type);
        ajax.set("date", date);
        var res = ajax.start();
        var xrr = [];
        var yrr = [];
        var arr = [];
        var brr = [];
        var crr = [];
        var drr = [];
        var err = [];
        var frr = [];
        res.data.forEach(function (item) {
            xrr.push(item.name);
            if(type === 'user'){
                yrr.push(item.value);
            }
            if(type === 'device'){
                yrr.push(item.bindNum);
            }
            if(type === 'banner'){
                arr.push(item.bannerOneShowNum);
                brr.push(item.bannerTwoShowNum);
                crr.push(item.bannerThreeShowNum);
                drr.push(item.bannerOneClickNum);
                err.push(item.bannerTwoClickNum);
                frr.push(item.bannerThreeClickNum);
            }
            if(type === 'time'){
                arr.push(Math.floor(item.stopCommunityTime / item.stopCommunityNum));
                // brr.push(Math.floor(item.stopGameTime / item.stopGameNum));
                brr.push(Math.floor(item.stopInteractTime / item.stopInteractNum));
                crr.push(Math.floor(item.stopChatTime / item.stopChatNum));
            }
            if(type === 'num'){
                arr.push(item.stopCommunityNum);
                // brr.push(item.stopGameNum);
                brr.push(item.stopInteractNum);
                crr.push(item.stopChatNum);
            }
        })
        var options = {
            tooltip: {trigger: 'axis', },
            grid: {left: '3%', right: '4%', bottom: '3%', containLabel: true},
            xAxis: {data: xrr},
            yAxis: {type: 'value'},
        }
        if(type === 'user'){
            options['series'] = [{name: '注册数量', type: 'line', smooth: true, data: yrr}]
            userChart.setOption(options);
        }
        if(type === 'device'){
            options['series'] = [{name: '绑定数量', type: 'line', smooth: true, data: yrr}]
            deviceChart.setOption(options);
        }
        if(type === 'banner'){
            options['legend'] = {
                data: ['广告1展示', '广告2展示', '广告3展示', '广告1点击', '广告2点击', '广告3点击']
            }
            options['series'] = [
                {name: '广告1展示', type: 'line', smooth: true, data: arr},
                {name: '广告2展示', type: 'line', smooth: true, data: brr},
                {name: '广告3展示', type: 'line', smooth: true, data: crr},
                {name: '广告1点击', type: 'line', smooth: true, data: drr},
                {name: '广告2点击', type: 'line', smooth: true, data: err},
                {name: '广告3点击', type: 'line', smooth: true, data: frr},
            ]
            bannerChart.setOption(options);
        }
        if(type === 'time' || type === 'num'){
            options['legend'] = {
                data: ['社区', '互动', '聊天']
            }
            options['series'] = [
                {name: '社区', type: 'line', smooth: true, data: arr},
                // {name: '游戏', type: 'line', smooth: true, data: brr},
                {name: '互动', type: 'line', smooth: true, data: brr},
                {name: '聊天', type: 'line', smooth: true, data: crr},
            ]
            if(type === 'time'){
                stopTimeChart.setOption(options);
            }else{
                stopNumChart.setOption(options);
            }
        }
    }

    function formatDuration(seconds, num) {
        if (seconds <= 0 || num <= 0) {
            return 0 + "秒";
        }
        let data = Math.floor(seconds / num);
        const minutes = data / 60;
        const hours = data / 3600;
        if(data < 60) {
            return data + "秒";
        }else if (minutes < 60) {
            return `${minutes.toFixed(2)}分钟`;
        } else {
            return `${hours.toFixed(2)}小时`;
        }
    }

    var ajax = new $ax(Feng.ctxPath + "/nanData/data");
    var result = ajax.start();
    var sexList = result.data.sexList;
    sexList = sexList.map(function (item) {
        if(item.name === 0){
            item.name = "男"
        }else if(item.name === 1){
            item.name = "女"
        }else{
            item.name = "未知";
        }
        return item;
    })
    var countryList = result.data.countryList;
    countryList = countryList.map(function (item) {
        if(!item.name){
            item.name = "未知"
        }
        return item;
    })
    $("#userTotal").text(result.data.userTotal);
    $("#userDataBeforeMonth").text(result.data.userDataBeforeMonth);
    $("#userDataCurrentMonth").text(result.data.userDataCurrentMonth);
    $("#userDataYesterday").text(result.data.userDataYesterday);
    $("#userDataToday").text(result.data.userDataToday);
    $("#deviceTotal").text(result.data.deviceTotal);
    $("#deviceDataBeforeMonth").text(result.data.deviceDataBeforeMonth);
    $("#deviceDataCurrentMonth").text(result.data.deviceDataCurrentMonth);
    $("#deviceDataYesterday").text(result.data.deviceDataYesterday);
    $("#deviceDataToday").text(result.data.deviceDataToday);
    $("#bannerTodayShowOne").text(result.data.bannerTodayShowOne);
    $("#bannerTodayShowTwo").text(result.data.bannerTodayShowTwo);
    $("#bannerTodayShowThree").text(result.data.bannerTodayShowThree);
    $("#bannerTodayClickOne").text(result.data.bannerTodayClickOne);
    $("#bannerTodayClickTwo").text(result.data.bannerTodayClickTwo);
    $("#bannerTodayClickThree").text(result.data.bannerTodayClickThree);
    $("#bannerYesterdayShowOne").text(result.data.bannerYesterdayShowOne);
    $("#bannerYesterdayShowTwo").text(result.data.bannerYesterdayShowTwo);
    $("#bannerYesterdayShowThree").text(result.data.bannerYesterdayShowThree);
    $("#bannerYesterdayClickOne").text(result.data.bannerYesterdayClickOne);
    $("#bannerYesterdayClickTwo").text(result.data.bannerYesterdayClickTwo);
    $("#bannerYesterdayClickThree").text(result.data.bannerYesterdayClickThree);
    $("#bannerBeforeMonthShowOne").text(result.data.bannerBeforeMonthShowOne);
    $("#bannerBeforeMonthShowTwo").text(result.data.bannerBeforeMonthShowTwo);
    $("#bannerBeforeMonthShowThree").text(result.data.bannerBeforeMonthShowThree);
    $("#bannerBeforeMonthClickOne").text(result.data.bannerBeforeMonthClickOne);
    $("#bannerBeforeMonthClickTwo").text(result.data.bannerBeforeMonthClickTwo);
    $("#bannerBeforeMonthClickThree").text(result.data.bannerBeforeMonthClickThree);
    $("#bannerCurrentMonthShowOne").text(result.data.bannerCurrentMonthShowOne);
    $("#bannerCurrentMonthShowTwo").text(result.data.bannerCurrentMonthShowTwo);
    $("#bannerCurrentMonthShowThree").text(result.data.bannerCurrentMonthShowThree);
    $("#bannerCurrentMonthClickOne").text(result.data.bannerCurrentMonthClickOne);
    $("#bannerCurrentMonthClickTwo").text(result.data.bannerCurrentMonthClickTwo);
    $("#bannerCurrentMonthClickThree").text(result.data.bannerCurrentMonthClickThree);
    $("#bannerTodayShow").text(result.data.bannerTodayShow);
    $("#bannerTodayClick").text(result.data.bannerTodayClick);
    $("#bannerYesterdayShow").text(result.data.bannerYesterdayShow);
    $("#bannerYesterdayClick").text(result.data.bannerYesterdayClick);
    $("#bannerBeforeMonthShow").text(result.data.bannerBeforeMonthShow);
    $("#bannerBeforeMonthClick").text(result.data.bannerBeforeMonthClick);
    $("#bannerCurrentMonthShow").text(result.data.bannerCurrentMonthShow);
    $("#bannerCurrentMonthClick").text(result.data.bannerCurrentMonthClick);

    $("#stopCommunityTimeToday").text(formatDuration(result.data.stopCommunityTimeToday, result.data.stopCommunityNumToday));
    $("#stopCommunityTimeYesterday").text(formatDuration(result.data.stopCommunityTimeYesterday, result.data.stopCommunityNumYesterday));
    $("#stopCommunityTimeBeforeMonth").text(formatDuration(result.data.stopCommunityTimeBeforeMonth, result.data.stopCommunityNumBeforeMonth));
    $("#stopCommunityTimeCurrentMonth").text(formatDuration(result.data.stopCommunityTimeCurrentMonth, result.data.stopCommunityNumCurrentMonth));
    $("#stopCommunityNumToday").text(result.data.stopCommunityNumToday + "人");
    $("#stopCommunityNumYesterday").text(result.data.stopCommunityNumYesterday + "人");
    $("#stopCommunityNumBeforeMonth").text(result.data.stopCommunityNumBeforeMonth + "人");
    $("#stopCommunityNumCurrentMonth").text(result.data.stopCommunityNumCurrentMonth + "人");

    // $("#stopGameTimeToday").text(formatDuration(result.data.stopGameTimeToday, result.data.stopGameNumToday));
    // $("#stopGameTimeYesterday").text(formatDuration(result.data.stopGameTimeYesterday, result.data.stopGameNumYesterday));
    // $("#stopGameTimeBeforeMonth").text(formatDuration(result.data.stopGameTimeBeforeMonth, result.data.stopGameNumBeforeMonth));
    // $("#stopGameTimeCurrentMonth").text(formatDuration(result.data.stopGameTimeCurrentMonth, result.data.stopGameNumCurrentMonth));
    // $("#stopGameNumToday").text(result.data.stopGameNumToday + "人");
    // $("#stopGameNumYesterday").text(result.data.stopGameNumYesterday + "人");
    // $("#stopGameNumBeforeMonth").text(result.data.stopGameNumBeforeMonth + "人");
    // $("#stopGameNumCurrentMonth").text(result.data.stopGameNumCurrentMonth + "人");

    $("#stopInteractTimeToday").text(formatDuration(result.data.stopInteractTimeToday, result.data.stopInteractNumToday));
    $("#stopInteractTimeYesterday").text(formatDuration(result.data.stopInteractTimeYesterday, result.data.stopInteractNumYesterday));
    $("#stopInteractTimeBeforeMonth").text(formatDuration(result.data.stopInteractTimeBeforeMonth, result.data.stopInteractNumBeforeMonth));
    $("#stopInteractTimeCurrentMonth").text(formatDuration(result.data.stopInteractTimeCurrentMonth, result.data.stopInteractNumCurrentMonth));
    $("#stopInteractNumToday").text(result.data.stopInteractNumToday + "人");
    $("#stopInteractNumYesterday").text(result.data.stopInteractNumYesterday + "人");
    $("#stopInteractNumBeforeMonth").text(result.data.stopInteractNumBeforeMonth + "人");
    $("#stopInteractNumCurrentMonth").text(result.data.stopInteractNumCurrentMonth + "人");

    $("#stopChatTimeToday").text(formatDuration(result.data.stopChatTimeToday, result.data.stopChatNumToday));
    $("#stopChatTimeYesterday").text(formatDuration(result.data.stopChatTimeYesterday, result.data.stopChatNumYesterday));
    $("#stopChatTimeBeforeMonth").text(formatDuration(result.data.stopChatTimeBeforeMonth, result.data.stopChatNumBeforeMonth));
    $("#stopChatTimeCurrentMonth").text(formatDuration(result.data.stopChatTimeCurrentMonth, result.data.stopChatNumCurrentMonth));
    $("#stopChatNumToday").text(result.data.stopChatNumToday + "人");
    $("#stopChatNumYesterday").text(result.data.stopChatNumYesterday + "人");
    $("#stopChatNumBeforeMonth").text(result.data.stopChatNumBeforeMonth + "人");
    $("#stopChatNumCurrentMonth").text(result.data.stopChatNumCurrentMonth + "人");

    var userChartDom = document.getElementById('userChart');
    var deviceChartDom = document.getElementById('deviceChart');
    var bannerChartDom = document.getElementById('bannerChart');
    var countryChartDom = document.getElementById('countryChart');
    var sexChartDom = document.getElementById('sexChart');
    var stopTimeChartDom = document.getElementById('stopTimeChart');
    var stopNumChartDom = document.getElementById('stopNumChart');
    var userChart = echarts.init(userChartDom);
    var deviceChart = echarts.init(deviceChartDom);
    var bannerChart = echarts.init(bannerChartDom);
    var countryChart = echarts.init(countryChartDom);
    var sexChart = echarts.init(sexChartDom);
    var stopTimeChart = echarts.init(stopTimeChartDom);
    var stopNumChart = echarts.init(stopNumChartDom);
    var countryOption = {
        title: {
            text: '用户国籍画像',
            textStyle: {fontSize: "14px"},
            left: 'center'
        },
        tooltip: {
            trigger: 'item'
        },
        legend: {
            orient: 'vertical',
            left: 'left'
        },
        series: [
            {
                name: '来自',
                type: 'pie',
                radius: '50%',
                data: countryList,
                emphasis: {
                    itemStyle: {
                        shadowBlur: 10,
                        shadowOffsetX: 0,
                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                    }
                }
            }
        ]
    };
    var sexOption = {
        title: {
            text: '用户性别画像',
            textStyle: {fontSize: "14px"},
            left: 'center'
        },
        tooltip: {
            trigger: 'item'
        },
        legend: {
            orient: 'vertical',
            left: 'left'
        },
        series: [
            {
                name: '性别',
                type: 'pie',
                radius: '50%',
                data: sexList,
                emphasis: {
                    itemStyle: {
                        shadowBlur: 10,
                        shadowOffsetX: 0,
                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                    }
                }
            }
        ]
    };
    countryChart.setOption(countryOption);
    sexChart.setOption(sexOption);
    getData("user", "day");
    getData("device", "day");
    getData("banner", "day");
    getData("time", "day");
    getData("num", "day");

    $("#dayUser").click(function(){
        $(this).addClass("sel");
        getData("user", "day");
        $("#monthUser").removeClass("sel");
    })
    $("#monthUser").click(function(){
        $(this).addClass("sel");
        getData("user", "month");
        $("#dayUser").removeClass("sel");
    })
    $("#dayBanner").click(function(){
        $(this).addClass("sel");
        getData("banner", "day");
        $("#monthBanner").removeClass("sel");
    })
    $("#monthBanner").click(function(){
        $(this).addClass("sel");
        getData("banner", "month");
        $("#dayBanner").removeClass("sel");
    })
    $("#dayTime").click(function(){
        $(this).addClass("sel");
        getData("time", "day");
        $("#monthTime").removeClass("sel");
    })
    $("#monthTime").click(function(){
        $(this).addClass("sel");
        getData("time", "month");
        $("#dayTime").removeClass("sel");
    })
    $("#dayDevice").click(function(){
        $(this).addClass("sel");
        getData("device", "day");
        $("#monthDevice").removeClass("sel");
    })
    $("#monthDevice").click(function(){
        $(this).addClass("sel");
        getData("device", "month");
        $("#dayDevice").removeClass("sel");
    })
    $("#dayNum").click(function(){
        $(this).addClass("sel");
        getData("num", "day");
        $("#monthNum").removeClass("sel");
    })
    $("#monthNum").click(function(){
        $(this).addClass("sel");
        getData("num", "month");
        $("#dayNum").removeClass("sel");
    })
});
